<script>
import { getSchoolCount } from '@/api/base.js';

export default {
    render: function (createElement) {
        return createElement("div", {
            attrs: {
                id: "SchoolDegree",
            },
            style: {
                height: "100%"
            }
        });
    },
    data() {
        return {
            dataList: [
                // { value: 1048, name: 'Search Engine' },
            ]
        }
    },
    methods: {
        initEchart() {
            var chartDom = document.getElementById('SchoolDegree');
            var myChart = echarts.init(chartDom);

            // 请求数据
            getSchoolCount().then(res => {
                var data = res.data
                for (let item in data) {
                    this.dataList.push({ value: data[item], name: item })
                }

                var option = {
                    tooltip: {
                        trigger: 'item'
                    },
                    title: {
                        text: '岗位学历要求',
                        top: '80%', left: '2%',
                        textStyle: {
                            color: '#fff',
                        },
                    },
                    legend: {
                        top: '5%',
                        left: 'center', textStyle: { color: '#fff' },
                    },
                    textStyle: {
                        color: '#fff',
                    },
                    series: [
                        {
                            name: 'Access From',
                            type: 'pie',
                            radius: ['20%', '70%'],
                            data: this.dataList,
                            avoidLabelOverlap: false,
                            itemStyle: {
                                borderRadius: 10,
                                borderColor: '#fff',
                                borderWidth: 2
                            },
                            label: {
                                show: false,
                                position: 'center'
                            },
                            emphasis: {
                                label: {
                                    show: true,
                                    fontSize: 40,
                                    fontWeight: 'bold',
                                    color: '#fff',
                                },
                                // borderColor: '#000'
                            },
                            labelLine: {
                                show: true
                            }
                        }
                    ]
                };
                myChart.setOption(option);
            })
        }
    },
    mounted() {
        this.initEchart();
    }
};
</script>